<html>
<head>
	<title>Grid Component</title>
</head>
<body>
	<table border="1">
		<thead bgcolor="#E6F2FF" >
			<tr>
				<td colspan="6"> Drag a column header and drop it here to group by the column </td>
			</tr>
			<tr>
				<td>
					<label for="ProductID">ProductID</label>
				</td>
				<td>
					<label for="Product name">Product name</label>
				</td>
				<td>
					<label for="Unit price">Unit Price</label>		
				</td>
				<td>
					<label for="Quantity">Quantity Per unit</label>
				</td>
				<td>
					<label for="Units">Units in stock</label>
				</td>
				<td>
					<label for="Discontinued">Discontinued</label>
				</td>
			</tr>
			<tr>
				<td>
					<input type="text" id="ProductID"></input>
				</td>
				<td>
					<input type="text" id="Product name"></input>
				</td>
				<td>
					<input type="text" id="Unit price"></input>
				</td>
				<td>
					<input type="text" id="Quantity"></input>
				</td>
				<td>
					<input type="text" id="Units"></input>
				</td>
				<td>
					<input type="checkbox" id="Discontinued"></input>
				</td>				
			</tr>
		</thead>
		
		<tfoot>
			<tr>
				<td>
					<label for="Page size">Page size</label>
					<select name="Page size" id="Page size">
					<option>6<option>
					<option>8<option>
					<option>10<option>
					<option>12<option>
					<option>14<option>
					<option>16<option>
					</select>
				</td>				
			</tr>
		</tfoot>
		<tbody>
			<tr>
				<td>1</td>
				<td>Chai</td>
				<td>$18.00</td>
				<td>10boxes*20bags</td>
				<td>39</td>
				<td>
					<input type="checkbox"></input>
				</td>				
			</tr>
			<tr>
				<td>2</td>
				<td>Chang</td>
				<td>$19.00</td>
				<td>24-12 oz bottles</td>
				<td>17</td>
				<td>
					<input type="checkbox"></input>
				</td>				
			</tr>	
			<tr>
				<td>3</td>
				<td>Aniseed Syrup</td>
				<td>$10.00</td>
				<td>12-550 ml bottles</td>
				<td>13</td>
				<td>
					<input type="checkbox"></input>
				</td>				
			</tr>
			<tr>
				<td>4</td>
				<td>fvjknekvne</td>
				<td>$15.00</td>
				<td>10-550 ml bottles</td>
				<td>16</td>
				<td>
					<input type="checkbox"></input>
				</td>				
			</tr>		
			<tr>
				<td>5</td>
				<td>Tomas Muler</td>
				<td>$52.00</td>
				<td>550 ml bottles</td>
				<td>22</td>
				<td>
					<input type="checkbox" selected="selected" ></input>
				</td>				
			</tr>
			<tr>
				<td>6</td>
				<td>Clarance Zeedorf</td>
				<td>$92.00</td>
				<td>12-12 oz jars</td>
				<td>2</td>
				<td>
					<input type="checkbox"></input>
				</td>				
			</tr>				
			<tr>
				<td>7</td>
				<td>ala bala</td>
				<td>$87.00</td>
				<td>550 ml bottles</td>
				<td>134</td>
				<td>
					<input type="checkbox"></input>
				</td>				
			</tr>
			<tr>
				<td>8</td>
				<td>oshte neshto</td>
				<td>$187.00</td>
				<td>550 ml bottles</td>
				<td>1</td>
				<td>
					<input type="checkbox"></input>
				</td>				
			</tr>
			<tr>
				<td>9</td>
				<td>Ikura</td>
				<td>$43.00</td>
				<td>20ml bottles</td>
				<td>11</td>
				<td>
					<input type="checkbox"></input>
				</td>				
			</tr>	
			<tr>
				<td>10</td>
				<td>oshte neshto i drugi neshta</td>
				<td>$56.00</td>
				<td>5ml bottles</td>
				<td>110</td>
				<td>
					<input type="checkbox"></input>
				</td>				
			</tr>					
			
		</tbody>
		
	</table>
</body>
</head>